<script setup lang="ts">
import Repair from '@/components/icons/Repair.vue';
import Feedback from '@/components/icons/Feedback.vue';
import YInfo from './components/YInfo.vue';
import { router } from '@/router';

const toRepair = () => {
    router.push({
        name: 'Repair'
    });
}

const toFeedback = () => {
    router.push({
        name: 'Feedback'
    });
}
</script>

<template>
    <div class="container">
        <YInfo></YInfo>
        <div class="item" @click="toRepair">
            <Repair style="padding-left: 3%;"></Repair>
            <p>申请报修</p>
        </div>
        <div class="item" @click="toFeedback">
            <Feedback style="padding-left: 3%;"></Feedback>
            <p>反馈与建议</p>
        </div>
    </div>
</template>

<style lang="scss" scoped>
.container {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    background-color: whitesmoke;
    .item {
        margin: 3%;
        border-radius: 15px;
        background-color: white;
        display: flex;
        align-items: center;
    }
}
</style>